<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人博客</title>
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./font/iconfont.css">
    <link rel="stylesheet" href="./assce/highlight.default.min.css">
    <link rel="stylesheet" href="./css/markdown.css">
    <link rel="stylesheet" href="./assce/editor_md/css/editormd.css" />
</head>

<body>
    <div class="container">
        <!-- 头部导航 -->
        <div class="header-container">
            <div class="header-container-fixed">
                <h1 class="header-title">我的博客</h1>
                <div class="header-logo">
                    <a href="#">
                        <img src="./avatar.jpg" alt="我的博客">
                    </a>
                </div>
                <div class="header-switch">
                    <i class="iconfont icon-liebiao"></i>
                </div>
            </div>
        </div>
        <!-- 主内容区域 -->
        <div class="main-container">
            <div id="markdowmBox" style="display: none;">
                <div class="markdownContainer">
                    <div class="markdown-header"></div>
                    <div class="markdown-body"></div>
                </div>
                <i class="iconfont icon-bianji"></i>
            </div>
            <div id="mdEdit" style="height: 100vh; display: none;" data-title="" data-tag="">
                <div id="editormd">
                    <textarea style="display:none;">这是一个在线md编辑器的实例</textarea>
                </div>
                <div class="iconBox">
                    <i class="iconfont icon-baocun"></i>
                    <i class="iconfont icon-tijiao"></i>
                </div>
            </div>
        </div>
        <!-- 蒙层 -->
        <div class="modal-pad-switch" style="display: none;"></div>
        <!-- 侧边目录栏 -->
        <div class="aside-container">
            <div class="aside-profile">
                <img src="./avatar.jpg" alt="我的博客">
                <span class="aside-profile-title">我的博客</span>
                <span class="aside-profile-description">偶尔聊技术</span>
                <i class="iconfont icon-tuichudenglu"></i>
            </div>
            <div class="defaultAdd">
                <span>博客目录</span>
                <i class="iconfont icon-tianjiawenjian"></i>
            </div>
            <ul class="aside-buttons">
                <li class="on">
                    <div class="router-link-active">
                        <i class="iconfont icon-youjiantou"></i>
                        <span>随机</span>
                    </div>
                    <ul class="fileDirectory">
                        <li>a</li>
                        <li>b</li>
                        <li>c</li>
                    </ul>
                </li>
                <li class="off">
                    <div class="router-link-active">
                        <i class="iconfont icon-youjiantou"></i>
                        <span>学习</span>
                    </div>
                    <ul class="fileDirectory"></ul>
                </li>
            </ul>
        </div>
    </div>

    <div id="tips">
        <span></span>
    </div>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="./assce/editor_md/editormd.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="./assce/highlight.min.js"></script>
    <script src="./js/plugin.js"></script>
    <script src="./js/index.js" type="module"></script>
</body>

</html>